<template>
  <div class="main">
    <el-card class="box-card">
      <el-row>
        <el-breadcrumb separator="/">
          <el-breadcrumb-item :to="{ path: '/' }">首页</el-breadcrumb-item>
          <el-breadcrumb-item>定时任务</el-breadcrumb-item>
          <el-breadcrumb-item>未跑任务</el-breadcrumb-item>
        </el-breadcrumb>
      </el-row>
      <el-row :gutter="5">
        <el-col :span="2">
          <el-input
              placeholder="请输入内容"
              v-model="input"
              clearable
          >
          </el-input>
        </el-col>
        <el-col :span="5">
          <el-button type="primary" icon="el-icon-search">添加</el-button>
        </el-col>
      </el-row>
      <el-row>
        <el-table
            :data="tableData"
            stripe
            style="width: 100%">
          <el-table-column
              prop="date"
              label="日期"
              width="180">
          </el-table-column>
          <el-table-column
              prop="name"
              label="任务ID"
              width="180">
          </el-table-column>
          <el-table-column
              label="操作">
            <el-row >
              <el-col :span="1">
                <el-button type="primary">修改</el-button>
              </el-col>
              <el-col :span="1">
                <el-button type="danger">删除</el-button>
              </el-col>
            </el-row>
          </el-table-column>
        </el-table>
      </el-row>
    </el-card>
  </div>
</template>

<script>
export default {
  name: "WaitJobs",
  data() {
    return {
      tableData: [{
        date: '2016-05-02',
        name: '王小虎',
        address: '上海市普陀区金沙江路 1518 弄'
      }, {
        date: '2016-05-04',
        name: '王小虎',
        address: '上海市普陀区金沙江路 1517 弄'
      }, {
        date: '2016-05-01',
        name: '王小虎',
        address: '上海市普陀区金沙江路 1519 弄'
      }, {
        date: '2016-05-03',
        name: '王小虎',
        address: '上海市普陀区金沙江路 1516 弄'
      }]
    }
  }
}
</script>

<style scoped>
.main {
  height: 100%;
  width: 100%;
}

.box-card {
  width: 98%;
  margin: 10px auto;
}

.el-breadcrumb {
  font-size: 16px;
}

.el-row {
  margin-bottom: 20px;
}

.el-row:last-child {
  margin-bottom: 0;
}
</style>
